<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- Title -->
    <title>烷铝烃的魔方小站</title>
    <link rel="stylesheet" type="text/css" href="css/index.css"/>
    <script src="http://mockjs.com/dist/mock.js"></script>
    <script src="https://unpkg.com/axios/dist/axios.min.js"></script>
    <script>
        Mock.mock("test", {
            name: {
                first: '@cname',
                middle: '@FIRST',
                last: '@LAST',
                full: '@first @middle @last'
            }
        })
    </script>
    <script>
        Mock.mock("test2", {
            "result|1-5": "★"
        })
    </script>
    <script>
        Mock.mock("mock3",{
            "array|1": [
                "【高能盘点】那些打破世界纪录的魔方女王（上）",
                "5.48 秒！世界纪录！许瑞航！中国历史上第一个三阶平均世界纪录！",
                "33.73 秒刷新五魔平均中国纪录！吴子钰！五魔之神！"
            ]
        })
    </script>
    <script>
        Mock.mock("mock3",{
            "array|1": [
                "【高能盘点】那些打破世界纪录的魔方女王（上）",
                "5.48 秒！世界纪录！许瑞航！中国历史上第一个三阶平均世界纪录！",
                "33.73 秒刷新五魔平均中国纪录！吴子钰！五魔之神！"
            ]
        })
    </script>
    <script>
        Mock.mock("mock4",{
            'regexp': /[a-z][A-Z][0-9][a-z]/
            })
    </script>
</head>
<body>
    <!-- 导航栏 -->
    <header id="pageHeader">
        <ul>
            <li><a href="method.html">教程</a></li>
            <li><a href="https://cubingchina.com/" target="_blank">粗饼网</a></li>
            <li><a href="shop.html">魔方新品</a></li>
            <li><a href="video.html">视频锦集</a></li>
            <li><a href="http://www.i-mofang.com/shuyu.shtml" target="_blank">魔方知识合集</a></li>
            <!-- Form's button -->
            <li>
                <a href="form.html"><input class="primary-btn" type="button" value="告诉我们你的魔方水平" /></a>
           </li>
        </ul>
        <h1>烷铝烃的魔方小站</h1>
    </header>

    <!-- 美句 -->
    <div id="siteAds">
        <p id="first"></p>
        <script src="js/mock1.js"></script>
        <p id="sentence"></p>
        <script src="js/mock.js"></script>
        <p id="star"></p>
        <script src="js/mock2.js"></script>
    </div>
    

    <!-- 侧边栏 -->
    <nav id="mainNav">
        <ul>
            <p>速拧教程</p>
            <li><a href="method.html">三阶魔方教程-层先</a></li>
            <li><a href="#">三阶速拧教程-CFOP</a></li>
            <li><a href="#">三阶速拧教程-桥式</a></li>
            <li><a href="#">二阶魔方教程-面先</a></li>
            <li><a href="#">二阶魔方教程-层先</a></li>
            <li><a href="#">四阶魔方教程-层先</a></li>
            <li><a href="#">四阶速拧教程-瑶</a></li>
            <li><a href="#">四阶速拧教程-84</a></li>
            <li><a href="#">五阶魔方教程-层先</a></li>
            <li><a href="#">五阶速拧教程-84</a></li>
            <li><a href="#">六阶魔方教程-层先</a></li>
            <li><a href="#">六阶速拧教程-84</a></li>
            <li><a href="#">七阶魔方教程-层先</a></li>
            <li><a href="#">七阶速拧教程-84</a></li>
            <li><a href="#">五魔方入门教程</a></li>
            <li><a href="#">五魔方速拧教程</a></li>
            <li><a href="#">金字塔魔方教程</a></li>
            <li><a href="#">斜转魔方教程</a></li>
            <li><a href="#">sq-1魔方教程</a></li>
            <li><a href="#">魔表教程</a></li>

            <p>盲拧教程</p>
            <li><a href="#">三阶盲拧</a></li>
            <li><a href="#">二阶盲拧</a></li>
            <li><a href="#">四阶盲拧</a></li>
            <li><a href="#">五阶盲拧</a></li>
            <li><a href="#">六阶盲拧</a></li>
            <li><a href="#">七阶盲拧</a></li>

            <p>异形魔方教程</p>
            <li><a href="#">粽子魔方教程</a></li>
            <li><a href="#">三阶魔方变体</a></li>
            <li><a href="#">傀儡魔方教程</a></li>
            <li><a href="#">北极星魔方教程</a></li>
            <li><a href="#">四叶草魔方教程</a></li>
            <li><a href="#">四叶草斜转魔方教程</a></li>

        </ul>
    </nav>
    
    <!-- Main article -->
    <article id="mainArticle">
        <div id="text">
            这是个关于魔方的小网站，主要的内容是魔方教程，如：三阶魔方入门玩法教程、高级魔方玩法CFOP教程、魔方盲拧视频教程、镜面魔方视频教程、二阶魔方、四阶魔方、四阶魔方yau方法、五阶魔方和六阶魔方、图案魔方、金字塔魔方、斜转魔方、五魔方、粽子魔方、SQ-1魔方还原教程等。魔方新品推荐。优秀视频锦集。介绍魔方知识等。本站致力于向魔方初学者介绍基本的魔方解法和魔方技巧，入门魔方教程会帮助你用非常短的时间学会怎样玩魔方，而且用很少的魔方公式，而高级魔方教程会教给你更厉害魔方秘籍和魔方口诀，让你成长为一个30秒以内的高手。希望大家都能在魔方中找到乐趣，早日成为魔方高手。Have fun with the Rubik's Cube!
        </div>
        <p id="daluan"></p>
        <script src="js/mock4.js"></script>
        <!-- 假的新品轮播图 -->
        <a href="shop.html">新品上市</a>
        <div id="img">
            <a href="https://detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22407630451.3.150953477Tsrsk&id=637475075663&rn=05ea58cb11d8be7a354dc870070adfaf&abbucket=6&scene=taobao_shop" target="_blank"><img src="../Img/lunbo-1.jpg" class="img"></a>
            <a href="https://detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22515859367.2.150953477Tsrsk&id=626469343055&rn=2994bac8994bae94a2f50e4433ca161d&abbucket=18&scene=taobao_shop" target="_blank"><img src="../Img/lunbo-2.jpg" class="img"></a>
            <a href="https://detail.tmall.com/item.htm?spm=a1z10.1-b-s.w5003-22515859367.3.150953477Tsrsk&id=633525031906&rn=21815dca8c6051f94055de2fb51eb07a&abbucket=12&scene=taobao_shop" target="_blank"><img src="../Img/lunbo-3.jpg" class="img"></a>
        </div>
        <!-- 大佬视频合集轮播图 -->
        <a href="video.html">视频锦集</a>
        <div id="video">
            <div class="video-title">
                <a href="https://www.bilibili.com/video/BV1cw411f79S" target="_blank"><img src="../Img/video-1.jpg" class="img-video"></a>
                <a href="https://www.bilibili.com/video/BV1cw411f79S" target="_blank" id="a-mock">【高能盘点】那些打破世界纪录的魔方女王（上）</a>
                <script src="../js/mock3.js"></script>
            </div>
            <div class="video-title">
                <a href="https://www.bilibili.com/video/BV1qv411V7nf?p=4" target="_blank"><img src="../Img/vidoe-3.jpg" class="img-video"></a>
                <a href="https://www.bilibili.com/video/BV1qv411V7nf?p=4" target="_blank">5.48 秒！世界纪录！许瑞航！中国历史上第一个三阶平均世界纪录！</a>
            </div>
            <div class="video-title">
                <a href="https://www.bilibili.com/video/BV1RV411x7QG" target="_blank"><img src="../Img/video-2.jpg" class="img-video"></a>
                <a href="https://www.bilibili.com/video/BV1RV411x7QG" target="_blank">33.73 秒刷新五魔平均中国纪录！吴子钰！五魔之神！</a>
            </div>
        </div>
    </article>

    <!-- About us -->
    <footer id="pageFooter">
        关于我们
        <ul>
            <li><a href="introduction.html">团队介绍</a></li>
            <li><a href="email.html">官方邮箱</a></li>
            <li><a href="../Img/QQ code.jpg">QQ交流群</a></li>
            <li><a href="Wechat.html">微信公众号</a></li>
        </ul>
    </footer>
</body>
</html>
<!-- 以最小的开发量 完成最基本的需求 让产品最快上线 之后 再改版 little by little step by step 格局打开-->